<template>
	<div class="main">
		<div class="main-top">
			<div @click="signOut" class="close">
				<img src="@/assets/images/wechat/student/studentcenter/close.png">
			</div>
			<div class="intro">
				<div class="avatar">
					<img v-if="studentData.avatar==0" src="@/assets/images/wechat/student/studentcenter/img-avatar.png">
					<img v-else :src="studentData.avatar">
				</div>
				<div class="name-school">
					<div class="name">{{studentData.name}}</div>
					<div class="school">{{studentData.schoolName}}</div>
				</div>
			</div>
			<div class="function">
				<div class="function-4">
					<router-link :to="{ path: '/wechatstudent/ad' }">
						<div>
							<img src="@/assets/images/wechat/student/studentcenter/school.png">
						</div>
						<div>普法竞答</div>
					</router-link>
					<router-link :to="{ path: '/wechatstudent/consultlist' }">
						<div>
							<img src="@/assets/images/wechat/student/studentcenter/consult.png">
						</div>
						<div>咨询记录</div>
					</router-link>
					<router-link :to="{ path: '' }">
						<div>
							<img src="@/assets/images/wechat/student/studentcenter/mediate.png">
						</div>
						<div>线上调解</div>
					</router-link>
					<router-link :to="{ path: '/wechatstudent/legalright' }">
						<div>
							<img src="@/assets/images/wechat/student/studentcenter/right.png">
						</div>
						<div>当前权益</div>
					</router-link>
				</div>
			</div>
		</div>
		<div class="main-bot">
			<router-link :to="{ path: '/wechatstudent/lawyerlist' }">
				<div>
					<img src="@/assets/images/wechat/student/studentcenter/lv.png">
				</div>
				<div>法律援助</div>
				<div>
					<div>找律师</div>
					<div>
						<img src="@/assets/images/wechat/student/studentcenter/icon-jian.png">
					</div>
				</div>
			</router-link>
			<router-link :to="{ path: '' }">
				<div>
					<img src="@/assets/images/wechat/student/studentcenter/heart.png">
				</div>
				<div>心理咨询</div>
				<div>
					<div>专业心理师</div>
					<div>
						<img src="@/assets/images/wechat/student/studentcenter/icon-jian.png">
					</div>
				</div>
			</router-link>
			<router-link :to="{ path: '' }">
				<div>
					<img src="@/assets/images/wechat/student/studentcenter/spend.png">
				</div>
				<div>消费记录</div>
				<div>
					<div>发票申请与查询</div>
					<div>
						<img src="@/assets/images/wechat/student/studentcenter/icon-jian.png">
					</div>
				</div>
			</router-link>
			<router-link :to="{ path: '/wechatstudent/setup' }">
				<div>
					<img src="@/assets/images/wechat/student/studentcenter/shezhi.jpg">
				</div>
				<div>设置</div>
				<div>
					<div>密码锁</div>
					<div>
						<img src="@/assets/images/wechat/student/studentcenter/icon-jian.png">
					</div>
				</div>
			</router-link>
		</div>
	</div>
</template>
<script>
import router from '@/router/index'
import { studentFindStudentById } from '@/api/student'

export default {
	components: {
		
	},
	data() {
		return {
			baseUrl:process.env.VUE_APP_BASE_API,
			studentData:{}
		}
	},
	created:async function() {
		var ajaxData = {}
		var resultData = await studentFindStudentById(ajaxData)
		if(resultData.code==200){
			this.studentData=resultData.data
		}
	},
	beforeMount: function() {
		
	},
	mounted: function() {
		
	},
	methods: {
		signOut:function(){
			localStorage.clear();
			this.$store.commit("setToken",'');
			router.replace({path:"/wechat/studentlogin"})
		}
	}
}
</script>
<style lang="scss" scoped>
	.main{
		width: 100%;
		height: 100vh;
		overflow: auto;
		background-color: #F4F4F4;
		.main-top{
			width: 100%;
			//height: 267px;
			background: #2252B5;
			border-bottom-right-radius:20px;
			border-bottom-left-radius:20px;
			position: relative;
			overflow: hidden;
			.close{
				width:27px;
				height:27px;
				overflow: hidden;
				position: absolute;
				top:47px;
				right:26px;
				>img{
					width:100%;
				}
			}
			.intro{
				margin-top:74px;
				margin-left:37px;
				display: flex;
				.avatar{
					width:72px;
					height:72px;
					overflow: hidden;
					>img{
						width:100%;
					}
				}
				.name-school{
					overflow: hidden;
					.name{
						font-weight: bold;
						margin-left:36px;
						margin-top:16px;
					}
					.school{
						font-size: 14px;
						font-weight: 400;
						color: #030303;
						margin-left:43px;
						margin-top:9px;
					}
				}
			}
			.function{
				margin-top:14px;
				margin-right:13px;
				margin-left:13px;
				margin-bottom: 13px;
				//height:94px;
				background-color: #E9EEF8;
				border-radius: 20px;
				overflow: hidden;
				.function-4{
					margin-left:28px;
					margin-right: 26px;
					margin-top:23px;
					margin-bottom: 11px;
					display: flex;
					>a{
						flex:1;
						text-align: center;
						color: #000000;
						font-size: 14px;
						>div:nth-child(1){
							width:34px;
							height: 34px;
							margin: auto;
							overflow: hidden;
							>img{
								width: 100%;
								
							}
						}
						>div:nth-child(2){
							margin-top:16px;
						}
					}
				}
			}
		}
		.main-bot{
			//height: 831px;
			padding-bottom: 7px;
			background:#FFFFFF;
			margin-left:6px;
			margin-right:6px;
			border-top-right-radius:20px;
			border-top-left-radius:20px;
			overflow: hidden;
			>a{
				margin-top: 30px;
				padding-top: 20px;
				margin-left:32px;
				margin-right:28px;
				padding-bottom: 18px;
				border-bottom:1px solid #D4D4D4;;
				display: flex;
				>div:nth-child(1){
					margin-left:20px;
					margin-right:27px;
					width:20px;
					height:20px;
					overflow: hidden;
					>img{
						width:100%;
					}
					
				}
				>div:nth-child(2){
					font-weight: 400;
					color: #070707;
					flex:1;
				}
				>div:nth-child(3){
					display: flex;
					font-size: 12px;
					line-height: 21px;
					font-weight: 400;
					color: #D4D4D4;
					margin-right:17px;
					>div:nth-child(1){
						margin-right:12px;
					}
					>div:nth-child(2){
						width:8px;
						height:14px;
						margin-top:3px;
						overflow: hidden;
						img{
							width: 100%;
						}
					}
				}
			}
			>a:nth-last-child(1){
				border-bottom: none;
			}
		}
		
	}
</style>